<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<script>
    /**
     * call
     * 1. 使用 `call` 方法调用函数时，第1个参数为 `this` 指定的值
     * 2. `call` 方法的其余参数会依次自动传入函数做为函数的参数
     *
     * apply
     * 1. 使用 `apply` 方法调用函数时，第1个参数为 `this` 指定的值
     * 2. `apply` 方法第2个参数为数组，数组的单元值依次自动传入函数做为函数的参数
     *
     * bind
     * `bind` 方法并**不会调用函数**，而是创建一个指定了 `this` 值的新函数
     */
    let teacher = {
        name: '小明',
        age: 18
    }

    let student = {
        name: '小红',
        age: 16
    }
    function counter(x, y) {
        console.log(this)
        return x + y;
    }
    let result2 = counter.call(student, 5, 10); // this是小红
    console.log(result2);
    let result3 = counter.apply(teacher, [5, 10]) // this是小明
    console.log(result3)
    let counterStu = counter.bind(student);
    let result4 = counterStu(111, 222);// this是小红
    console.log(result4)
</script>
</body>
</html>